import "./App.css";
import { connect } from "react-redux";
import {
  SET_HOME_VALUE,
  SET_COUNTER_VALUE,
} from "./store/actionType/constants";
function App(props) {
  const { home, counter, addCounter, changeHomeValue } = props;
  return (
    <div className="App">
      react redux
      <h1>{home.homeValue}</h1>
      <h1>{counter.counterValue}</h1>
      <button onClick={() => addCounter()}>add counter</button>
      <button onClick={() => changeHomeValue([{username:"ceshi",age:99}])}>
        改变home值
      </button>
    </div>
  );
}
const mapStateToProps = (state) => {
  const { home, counter } = state;
  return {
    home,
    counter,
  };
};
const mapDispatchToProps = (dispatch) => {
  return {
    addCounter: () => {
      dispatch({ type: SET_COUNTER_VALUE });
    },
    changeHomeValue: (payload) => {
      dispatch({ type: SET_HOME_VALUE, payload });
    },
  };
};
export default connect(mapStateToProps, mapDispatchToProps)(App);
